html, body {
        position: relative;
        height: 100%;
    }
    body {
        background: #eee;
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        color:#000;
        margin: 0;
        padding: 0;
    }
    .swiper-container {
        width: 100%;
        height: 100%;
    }
    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        /*display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;*/
    }
    
    /*第一屏*/
.swiper-slide.one{
    	width: 100%;
    	background: url(../image/onebg.png) no-repeat;
    	
    }
    	#top{
    		width: 70%;
    		height: 50%;
    		margin: 0 auto;
    		border: 8px solid white;
    		overflow: hidden;
    		margin-top: 5%;
    		
    		
    	}
    	#top .one{
    		width: 100%;
    	
    	}
    	#bottom{
    		width: 70%;
    		height: 30%;
    	 /*  border:2px solid yellow ;*/
    	margin: 5% auto;
    	position:relative ;
    	
    		
    		
    	}
    	#bottom .jiezhi{
    		width: 25%;
    		position: absolute;
    		left: 0;
    		top: 5%;;
    	}
    	#bottom .jh{
    		width: 80%;
    		position: absolute;
    		left: 15%;
    		top: 5%;
    	}
    	#bottom .rq{
    		width: 55%;
    		position: absolute;
    		left: 50%;
    		
    		bottom: 0;
    		-moz-transform: translateX(-50%);
		    -webkit-transform: translateX(-50%);
		     -o-transform: translateX(-50%);
		     -ms-transform: translateX(-50%);
    	}
    	
    	.top3{
    		width: 80%;
    		height: 60%;
    		margin: 0 auto;
    		border: 8px solid white;
    		overflow: hidden;
    		margin-top:2%;
 	
    	}
    	.top3 .t3{
    		width: 100%;
    		height:100%;    		
    	}
    	.top2{
    		width: 80%;
    		height: 30%;
    		margin: 0 auto;
    		border: 8px solid white;
    		overflow: hidden;
    		margin-top:2%;
    			
    	
    	}
    	.top2 .t2{
    		width: 100%;
    		height:100%;
       		border: 1px solid gold;
    		
    	}
    	#music{
    		width: 60px;
    		height: 60px;
    		position: fixed;
    	
    		right: 10px;
    		top: 10px;
    		z-index: 99;
    	}
    	#music .music_bg{
    		width: 60px;
    		height: 60px;
    		
    	} 
    	 	@keyframes m{
	from{
		transform: rotate(0deg);
	}
	to{
		transform: rotate(360deg);
	}
   }
    	#music .music_pic{
    	  position: absolute;
    	  left:8px;
    	  top: 8px;
           animation: m 6s infinite linear;
    	}
  

   /*第一屏结束*/
  .swiper-slide.three{
	background: url(../image/twobg.jpg) no-repeat;
	background-size: 100% 100%;
	position: relative;
}
 .swiper-slide.three .left{
 	width: 30%;
 	height: 20%;
 	position: absolute;
 	left:5%;
 	top: 5%;
 	border: 7px solid white;
 	z-index: 3;
 	overflow: hidden;
 	
 }
 .swiper-slide.three .left img{
 	width: 100%;
 }
 .swiper-slide.three .right .t{
 	width: 60%;
 	height: 80%;
 	border: 7px solid white;
 	position: absolute;
 	background: ;
 	left:28%;
 	top:10%;
 }
  .swiper-slide.three .right .t img{
  	width: 100%;
  	float: left;
  }
 .swiper-slide.three .right.t>img{
 	width: 100%;
 }
 
 
 
 
 
 
 